<template>
  <el-card shadow="hover" style="height: 100%;overflow: auto;" :body-style="{height:'100%'}">
    <template #header>
        元素平滑移入
    </template>


    <div v-slide-in v-for="item in 100" class="box" :style="{background:randomRgbColor()}">
      <h1>{{item}}</h1>
    </div>
  </el-card>
</template>
<script setup lang="ts">
import {randomRgbColor} from "@/utils/theme";


</script>

<style scoped lang="less">
.box{
  width: 400px;
  height: 200px;
  margin: 20px auto 0 auto;
  border-radius: 10px;
  text-align: center;
  line-height: 200px;
  h1{
    color: whitesmoke;
  }
}
</style>
